<template>
  <Drawer :closable="false" width="640" v-model="showDrawer">
    <p>
      <b>地区患者互换</b
      ><Tag
        type="border"
        :color="infos.share_status_str == '已取消' ? 'default' : 'primary'"
        class="ivu-ml-8"
        >{{ infos.share_status_str }}</Tag
      >
    </p>
    <Divider />
    <div class="demo-drawer-profile">
      <Row>
        <Col span="12" class="info">
          <h3 class="ivu-mb-8">筛选条件</h3>
          <p>
            <span>原项目</span><b>{{ infos.select_project_name }}</b>
          </p>
          <p>
            <span>创建时间</span
            ><b
              >{{ infos.select_create_stime }} -
              {{ infos.select_create_etime }}</b
            >
          </p>
          <p>
            <span>地区</span
            ><b>{{
              infos.select_city_name && infos.select_city_name.length > 0
                ? infos.select_city_name.join("、")
                : ""
            }}</b>
          </p>
          <p>
            <span>患者状态</span
            ><b>{{
              infos.select_patient_status_name &&
              infos.select_patient_status_name.length > 0
                ? infos.select_patient_status_name.join("、")
                : ""
            }}</b>
          </p>
          <p>
            <span>回访次数</span
            ><b>{{
              infos.select_max_callback_num != ""
                ? infos.select_max_callback_num + "次"
                : ""
            }}</b>
          </p>
        </Col>
        <Col span="2" class="ivu-text-center">
          <Divider type="vertical" style="height: 100%;" />
        </Col>

        <Col span="10">
          <p>目标项目</p>
          <p>
            <Tag type="border">{{ infos.target_project_name }}</Tag>
          </p>
          <p>分配归属人</p>
          <p>
            <Tag
              type="border"
              v-for="item in infos.target_member_name"
              :key="item"
              >{{ item }}</Tag
            >
          </p>
        </Col>
      </Row>
    </div>
    <div class="demo-drawer-profile">
      <h3 class="ivu-mt-8 ivu-mb-8">切割数据</h3>
      <p>
        <b
          >患者：{{
            infos.allot_patient_data ? infos.allot_patient_data.patient : ""
          }}</b
        >
        <b class="ml-32"
          >公海：{{
            infos.allot_patient_data ? infos.allot_patient_data.sea : ""
          }}</b
        >
        <b class="ml-32"
          >鱼池：{{
            infos.allot_patient_data ? infos.allot_patient_data.fish : ""
          }}</b
        >
      </p>
    </div>
  </Drawer>
</template>
<script>
import { shareInfo } from "@/api/datashare";
export default {
  name: "datashare",
  data() {
    return {
      showDrawer: false,
      infos: {},
    };
  },
  methods: {
    init(id = 0) {
      this.showDrawer = true;
      shareInfo({ id: id }).then((res) => {
        this.infos = res;
      });
    },
  },
};
</script>
<style lang="less" scoped>
.demo-drawer-profile p {
  line-height: 45px;
  color: #777;
}
.demo-drawer-profile p b {
  color: #515a6e;
}
.info p span {
  display: inline-block;
  width: 80px;
}
.ml-32 {
  margin-left: 32px;
}
</style>
